<template>
  <div class="box">
    <h2>Child333 component</h2>
    <h3>msg: {{msg}}</h3>
  </div>
</template>

<script lang="ts" name="Child3" setup>
import {onBeforeUnmount, onMounted, ref} from "vue";
import PubSub from 'pubsub-js'
  const msg = ref('')
  // 组件挂载后
  onMounted(() => {
    // 订阅消息
    PubSub.subscribe('updateMsg',(msgName,data) => {
      msg.value += data
    })
  })
  // 组件销毁前
  onBeforeUnmount( () => {
    // 取消订阅
    PubSub.unsubscribe('updateMsg')
  })
</script>

<style scoped>

</style>
